<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<link rel="stylesheet" type="text/css" href="../stylesheets/home.css">
<script type="text/javascript" src="../javascripts/jquery-1.8.1.js"></script>
<title><%=title%></title>
</head>
<body>
	<header class="header-home">
		<div class="header-nav-home">
			<div class="header-nav-right-home">
				<span class="header-nav-textue-home"></span>
				<span class="header-nav-font-home">目的地</span>
				<span class="header-nav-font-home">锦囊</span>
				<span class="header-nav-font-home">行程助手</span>
				<span class="header-nav-font-home">社区</span>
				<span class="header-nav-bule-home">最世界.自由行</span>
				<span class="header-nav-font-home">机票</span>
				<span class="header-nav-font-home">酒店</span>
				<span class="header-nav-font-home">预订</span>
			</div>
			<div class="header-nav-left-home">
				<input type="text"/>
				<span class="header-nav-sear-home"></span>
				<span class="header-nav-one-home">|</span>
				<span class="header-nav-qq-home header-nav-left-flag"></span>

				<span class="header-nav-xinlang-home header-nav-left-flag"></span>
				<span class="header-nav-weixin-home header-nav-left-flag"></span>
				<span></span>
				<span class="header-nav-font-home header-nav-left-flag">注册</span>
				<span class="header-nav-font-home header-nav-left-flag header-nav-last-home">登录</span>

			</div>
		</div>
		<div class="header-inner-home">
			<div class="header-inner-right-home"></div>
			<div class="header-inner-middle-home">
				<div>
					<input type="text" placeholder="搜索国家" class="header-inner-middle-search-home">
					<div class="header-inner-middle-seek-home">
						<span class="header-inner-middle-first-home"></span>
						<span></span>
						<span class="header-inner-middle-last-home">搜索</span>
					</div>
				</div>
			</div>
			<div class="header-inner-left-home">
				<div class="header-inner-iphone">
					<span class="header-inner-textue-home"></span>
					<span class="header-inner-name-home">APP</span>
				</div>
			</div>
		</div>	
	</header>
	<div class="main-home">
		<div class="mian-nav-home">
			<span>首页</span>
			<span>机酒自由行</span>
			<span>城市玩乐<span></span></span>
			<span>签证</span>
			<span>租车自驾</span>
			<span>邮轮</span>
			<span>海岛游</span>
			<span>限时特卖</span>
			<span>特色线路</span>
			<span>CityWalk</span>
		</div>
		<div class="mian-inner-home">
			<ul class="main-pro-home">
				<%for(var i=0;i<menuData.length;i++){%>
					<li class= "main-pro-home-li menuClick "  id=<%=i%> >
						<div class="main-pro-right"></div>
						<div class="main-pro-middle">
							<p><%=menuData[i].title%></p>
							<p>
							<%for(var j=0;j<menuData[i].mainCity.length;j++){%>
								<span><%=menuData[i].mainCity[j]%></span>
							<%}%>
							</p>
						</div>
						<div class="main-pro-left"></div>
					</li>
				<%}%>
			</ul>
			<div class="main-pro-info-home">	
			</div>
		</div>
		<div class="main-ads-home">
			<ul>
				<li></li>
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</div>

		<div class="main-special-home">
			<div class="main-special-header-home">
				<span class="main-special-title">限时特卖</span>
				<span>每日必看的特价精选</span>
				<span class="main-special-change">  换一换</span>
			</div>
			<ul class="main-special-contone-home">
				<li>
					<div class="main-special-texture">
						
					</div>
					<div class="main-special-right">
						<p>【限时秒杀】北京直飞香港5天往返含税机票</p>
						<p>8999<span class="mian-special-last-font">元起</span></p>
					</div>
				</li>
				<li>
					<div class="main-special-texture">
						
					</div>
					<div class="main-special-right">
						<p>【限时秒杀】北京直飞香港5天往返含税机票</p>
						<p>8999<span class="mian-special-last-font">元起</span></p>
					</div>
				</li>
				<li>
					<div class="main-special-texture">
						
					</div>
					<div class="main-special-right">
						<p>【限时秒杀】北京直飞香港5天往返含税机票</p>
						<p>8999<span class="mian-special-last-font">元起</span></p>
					</div>
				</li>
			</ul>
		</div>

		<div class="mian-freedom-play">
			<div class="main-special-header-home">
				<span class="main-special-title">机酒自由行</span>
				<span>精选全球最优质机票、酒店、邮轮等旅行产品</span>
				<ul class="mian-freedom-play-title">
					<%for(var i=0;i<freeWalk.length;i++){%>
						<%if(i==index){%>
							<li><a id=<%=i%>  class="mian-freedom-play-title-link mian-active"><%=freeWalk[i].title%></a></li>
						<%}else{%>
							<li><a id=<%=i%>  class="mian-freedom-play-title-link "><%=freeWalk[i].title%></a></li>
						<%}%>
					<%}%>					
				</ul>
			</div>
			<div class="main-freedom-home">
				<%for(var i=0;i<freeWalk[index].data.length;i++){%>
					<%if(i==0){%>
						<div class="main-freedom-one" style=background:url(<%=freeWalk[index].data[i].imgUrl%>)>
							<div class="main-plane">
								<span class="main-plane-title">机票</span>
								<span class="main-plane-price"><%=freeWalk[index].data[i].price%><span class="main-plane-price-last">元起</span></span>
							</div>
							<div class="main-freedom-bottom">
								<p  class="main-freedom-def"><%=freeWalk[index].data[i].title%></p>
								<p  class="main-freedom-time"><%=freeWalk[index].data[i].time%></p>
							</div>
						</div>
					<%}else{%>
						<div class="main-freedom-other" style=background-image:url(<%=freeWalk[index].data[i].imgUrl%>)>
							<div class="main-plane main-plane-other">
								<span class="main-plane-title">机票</span>
								<span class="main-plane-price"><%=freeWalk[index].data[i].price%><span class="main-plane-price-last">元起</span></span>
							</div>
							<div class="main-freedom-other-bottom">
								<p>
									<%=freeWalk[index].data[i].title%>
								</p>
							</div>
						</div>
					<%}%>
				<%}%>
				<div class="main-freedom-other main-freedom-other-last">
					<div class="main-freedom-other-last-title">
						查看更多<br>自由行产品
					</div>
					<p class="main-freedom-other-last-info">
						<span>机票</span>
						<span>机票</span>
						<span>机+酒</span>
						<span>机票</span>
					</p>
				</div>
			</div>
			
		</div>
	</div>
	<footer class="footer-home">
		<ul class="footer-title">
			<li>机酒自由行</li>
			<li>城市玩乐</li>
			<li>签证</li>
			<li>租车自驾</li>
			<li>游轮</li>
			<li>海岛游</li>
			<li>限时特卖</li>
			<li>特色线路</li>
			<li>CityWalk</li>
			<div class="main-city"></div>
		</ul>
		<ul  class="footer-name">
			<li>
				<div class="footer-name-icon footer-name-icon-one"></div>
				<h3>专业保证</h3>
				<p class="footer-name-des">我们收集穷游er的真实诉求，也找寻全世界最独特的旅行目的地，让更多的穷游er轻松出行</p>
			</li>
			<li>
				<div class="footer-name-icon footer-name-icon-two"></div>
				<h3>专业保证</h3>
				<p class="footer-name-des">我们收集穷游er的真实诉求，也找寻全世界最独特的旅行目的地，让更多的穷游er轻松出行</p>
			</li>
			<li>
				<div class="footer-name-icon footer-name-icon-three"></div>
				<h3>专业保证</h3>
				<p class="footer-name-des">我们收集穷游er的真实诉求，也找寻全世界最独特的旅行目的地，让更多的穷游er轻松出行</p>
			</li>
		</ul>





		 
	</footer>
</body>
<script type="text/javascript" src="../javascripts/index.js"></script>
</html>